<%@ page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>LarryBlogCMS-Home</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/common/layui/css/layui.css"
          media="all">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/common/bootstrap/css/bootstrap.css"
          media="all">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/common/global.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/main.css" media="all">
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/common/bootstrap/js/jquery-1.12.4.js"></script>
    <script type="text/javascript"
            src="${pageContext.request.contextPath}/common/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/pageJs/system/permission.js"></script>
</head>
<body>
<div class="container">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h3 class="text-center" style="color: yellow" >管理科室权限(医务处)</h3>
        </div>
        <div class="panel-body">
            <form  id="dempentform" method="post" action="">
                <div class="col-xs-12">
                    <div class="form-group col-sm-5 text-left">
                        <p class="control-label"style="color: #090ff7;font-size:20px">科室名称:
                            <select class="form-control"  id="ks" style="height:35px;" name="departmentId"></select>
                        </p>
                    </div>
                    <div class="form-group col-sm-5 text-left">
                        <p class="control-label"style="color: #090ff7;font-size:20px">人员名称:
                        <select class="form-control"  id="user" style="height:35px;" name="userId"></select>
                        </p>
                    </div>
                </div>
                <div id="div2">
                    <div class="col-md-3 text-left">
                        <button type="button"  class="btn btn-primary " id="add">新增</button>
                    </div>
                    <div class="col-md-3 text-right">
                        <button type="button"  class="btn btn-primary " id="js">检索</button>
                    </div>
                </div>
                <div id="div3" class="col-xs-6 text-center" style="display:none;">
                    <button type="button"  class="btn btn-primary"id="bc">保存</button>
                    <button type="button"  class="btn btn-primary"id="fh">返回</button>
                </div>
            </form>
        </div>
    </div>
    <table class="table table-bordered table-striped table-hover" style="background:lightblue">
        <thead>
        <tr>
            <th class="col-sm-1 text-center">序号</th>
            <th class="col-sm-1 text-center">科室</th>
            <th class="col-sm-1 text-center">人员</th>
            <th class="col-sm-2 text-center">操作</th>

        </tr>
        </thead>
        <tbody>
        <c:forEach items="${userDepartmentList}" var="userDepartment" varStatus="i">
            <tr <c:if test="${i.count%2==0 }">style="background:lightgreen"</c:if> >
                <td>${i.count}</td>
                <td>${userDepartment.departmentName}</td>
                <td>${userDepartment.username}</td>
                <td>
                    <a href="javascript:bj(${userDepartment.id })"><button type="button"  class="btn btn-primary">编辑</button></a>
                    <a href="javascript:del(${userDepartment.id})"><button type="button"  class="btn btn-primary">删除</button></a>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
</div>
</body>
<script type="text/javascript">
    function del(id){
        if(confirm("确定删除吗？")){
            $.ajax({
                url:"/deldepementid?id="+id,
                dateType:"JSON",
                type:"GET",
                success:function(result){
                    if(result!=null){
                        alert("删除成功");
                        location.href="/selectUserDepartment";
                    }else{
                        alert("删除失败");
                    }
                },
                error:function(result){
                    alert("删除失败，服务器错误！");
                }
            });
        }
    }
    function bj(id) {
        $("#div2").hide();
        $("#div3").show();

        $.ajax({
            url:"/selectdepementbyid",
            type:"post",
            datatype:"json",
            data:{
                id:id
            },
            success:function (result) {
                console.log(result.UserDepartment.userId);
                var username = result.UserDepartment.username;
                var sele = document.getElementById("ks");
                var arr = sele.options;
                console.log(arr);
                var useval = '<option value="'+ result.UserDepartment.userId+'" selected= "selected" >'+result.UserDepartment.username+'</option>';
                $("#user").append(useval);
                for (var i = 0;i <arr.length;i ++){
                    if (arr[i].value == result.UserDepartment.departmentId){
                        arr[i].selected= true;
                        $("#ks").attr("disabled","disabled");
                        var ksid = $("#ks").val();
                        $("#user").empty();
                        $.ajax({
                            url:"/getuserlist",
                            type:"post",
                            datatype:"json",
                            data:{
                                id:ksid,
                            },
                            success:function(result){
                                console.log(result);
                                for (var i = 0; i < result.meaningUserlist.length; i++) {
                                    $("#user").append
                                    ('<option value=' +result.meaningUserlist[i].userId+ '>' + result.meaningUserlist[i].username + '</option>');
                                }
                            }
                        })

                    }
                }
            }
        })
        $("#fh").click(function () {
            $("#div2").show();
            $("#div3").hide();
            $("#ks").removeAttr("disabled");
        })
        $("#bc").click(function () {
            var data = $.param({id: id}) + "&" + $("#dempentform").serialize() + "";
            $.ajax({
                url: "/upUserDepartment",
                data: data,
                datatype: "json",
                type: "post",
                success: function (result) {
                    console.log(result);
                    location.href = "/selectUserDepartment";
                }
            })
        })
    }
</script>
</html>